var Highlights = Class.create({
  initialize: function(holder, name, action, section) {
  	this.holder = holder;
	this.name = name;
	//this.data = data;
	this.timer;
	this.action = action;
	this.section = section
	this.apiCall(this.action);
	//(!data) ? this.apiCall(this.action) : this.create();
  },
  apiCall: function(action, params){
    var options = { method : 'post', parameters : 'r=feed/highlight&section='+ this.section, onSuccess: this.onComplete.bindAsEventListener(this) };
    new Ajax.Request(Loader.AJAX_PATH + 'index.php', options);
  },
  onComplete: function(transport) {
  	var json = transport.responseJSON;
  	this.data = json.items;
  	this.length = json.length;
  	this.create();
  },
  version: '0.0.1',
  z: 0,
  duration: 7000,
  current: -1,
  loaded: 0,
  n: 0,
  status: false,
  create: function(){
	var target = $(this.holder).update("");
	var ul_controls = new Element('ul', { 'id': this.holder + '-controls' });
	var div_images = new Element('div', { 'id': this.holder + '-images' });
	
	target.appendChild(div_images);
	target.appendChild(ul_controls);
	
	this.addImage(this.loaded);
	
	var tmp_a = new Element('a', { href: 'javascript:' + this.name + '.pause();', 'id': 'highlights-pause' }).update("");
	var play = new Element('li', { 'id': this.holder + '-control-play', 'class': 'right' }).update(tmp_a);
	ul_controls.appendChild(play);
	
	this.start(0);
  },
  
  play: function(){
	if (this.status == false){
		this.start(0);
		var play = $(this.holder + '-control-play').getElementsByTagName('a')[0];
		play.id = "highlights-pause";
		play.writeAttribute('href', 'javascript:'+this.name+'.pause()');
		play.update("");
	}
  },
  	
  pause: function(){
	this.status = false;
	clearTimeout(this.timer);
	var play = $(this.holder + '-control-play').getElementsByTagName('a')[0];
		play.id = "highlights-play";
	play.writeAttribute('href', 'javascript:'+this.name+'.play()');
	play.update("");
  },
 
  start: function(d){
	this.status = true;
	this.timer = setTimeout(this.next.bindAsEventListener(this), d);
  },
  
  next: function(){
	this.current++;
	if (this.current > this.loaded) this.current = 0;
	this.fadeIn(this.holder + "-" + this.current);
	this.start(this.duration);
  },
 
  addImage: function(id){
	  var target = $(this.holder);
	  var div_images = $(this.holder + "-images");
	  var ul_controls = $(this.holder + "-controls");
	  var tmp_link = new Element('a', { 'href': this.data[id].link, 'target' : '_blank' });
	  var tmp_img = new Element('img', { 'id': this.holder + "-" + id });
	  tmp_img.onload = this.loader.bindAsEventListener(this);
	  tmp_img.setStyle({ 'display': 'none' });
	  tmp_link.appendChild(tmp_img)
	  div_images.appendChild(tmp_link);
	  tmp_img.src = this.data[id].image;
	  var nm = (this.data[id].ad == true) ? "A" : this.n+1;
	  if (this.data[id].ad != true) this.n++;
	  var tmp_a = new Element('a', { href: "javascript:" + this.name + ".view('" + this.holder + "-" + id + "');"}).update(nm);
	  var tmp_li = new Element('li', { 'id': this.holder + "-control-" + id }).update(tmp_a);
	  ul_controls.appendChild(tmp_li);
	  },
  
  loader: function(){
	if (this.loaded < (this.length-1)){
		this.loaded++;
		this.addImage(this.loaded);
	}
  },
  	
  view: function (id){
  	this.pause();
  	this.fadeIn(id);
  },
  
  fadeIn: function(id){
	var target = $(id);
	if (target.style.display == "none"){
		this.current = this.getNode(id);
		target.setStyle({ 'display': 'none', 'zIndex': this.z++ });
		new Effect.Appear(target, { duration: 0.5, afterFinish:this.disarm.bindAsEventListener(this) });
		this.select(id);
	}
  },
	
  disarm: function(){
	for (var i = 0; i < this.length; i++){
		var image = $(this.holder + "-" + i);
		if (this.current != i && image) image.setStyle({ 'display': 'none' });
	}
  },
  
  select: function(id){
	var n = this.getNode(id);
	
	for (var i = 0; i < (this.loaded+1); i++){
		var target = $(this.holder + "-control-" + i).getElementsByTagName("a")[0];
		(i != n) ? target.removeClassName('selected') : target.addClassName('selected');
	}
  },
  
  getNode: function(id){
	var n = id.split("-");
	n = n[n.length-1];
	return n;
  }

});
